<template>
    <div>{{msg}}
      <br>
      <button @click="emitNews()">给News组件广播数据</button>
      <br>
      Vuex中数据：{{this.$store.state.count}}
      <button @click="incCount()">增加数量+</button>
    </div>

</template>

<script>
    import VueEvent from "../model/VueEvent";
    import store from "../vuex/store";
    export default {
        name: "HomePage",
        data(){
          return {
             msg:"我是HomePage组建"
          }
        },
        store,
        methods:{
            emitNews(){
                //广播数据
                VueEvent.$emit('to-news',this.msg)
            },
            incCount(){
                //改变vuex store里面的数据
                this.$store.commit('incCount');   /*触发 mutations 改变 state里面的数据*/
                this.$store.dispatch('incMutationsCount');   /*触发 actions里面的方法   */
            }
        },
        mounted(){
            //监听news 广播的数据
            VueEvent.$on('to-home',function(data){
                console.log("in home ",data);
            })
        }
    }
</script>

<style scoped>

</style>
